<script lang="ts" setup>
import {
  NConfigProvider,
  darkTheme,
  lightTheme,
  NMessageProvider,
  NNotificationProvider,
  NDialogProvider,
  NLoadingBarProvider,
} from "naive-ui"
import { onMounted } from "vue"
import fullScreenLoading from "@cop/loading/fullScreenLoading/index.vue"
import { useSettingStore, type Theme } from "@/store"
import { getToken } from "@/util/auth"
import home from "@/views/home.vue"

const store = useSettingStore()
// const userStore = useUserStore()
const initThemeColor = () => {
  store.setThemeColor(store.themeColor)
}
const initTheme = () => {
  const hours = new Date().getHours()
  if (hours >= 18 || hours <= 4) {
    store.setTheme("dark")
  } else {
    store.setTheme("light")
  }
}
// if (getToken()) {
//   userStore.getUserInfo()
//   userStore.setToken(getToken())
// }
onMounted(() => {
  initThemeColor()
  initTheme()
})
</script>

<template>
  <n-config-provider
    :theme="store.theme == 'light' ? lightTheme : darkTheme"
    :theme-overrides="{
      common: {
        primaryColor: store.themeColor,
        primaryColorHover: store.themeColor,
        primaryColorPressed: store.themeColor,
        primaryColorSuppl: store.themeColor,
      },
      Scrollbar: {
        color: `var(--themeColor)`,
        colorHover: 'var(--themeColor)',
      },
    }"
  >
    <n-notification-provider>
      <n-dialog-provider>
        <n-loading-bar-provider>
          <n-message-provider>
            <home />
            <fullScreenLoading />
          </n-message-provider>
        </n-loading-bar-provider>
      </n-dialog-provider>
    </n-notification-provider>
  </n-config-provider>
</template>

<style lang="scss">
@import url("@/styles/reset.scss");

//自定义nprogress颜色 #nprogress
.bar {
  background: var(--themeColor) !important; //自定义颜色
}

body {
  background-color: var(--bodyBg);
  transition: all 0.3s var(--n-bezier);
  // opacity: 1 !important;
}

::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

html.light::view-transition-old(root),
html.dark::view-transition-new(root) {
  z-index: 1;
}

html.light::view-transition-new(root),
html.dark::view-transition-old(root) {
  z-index: 999999;
}
</style>
